<template slot>
  <scroller lock-x :height="height" ref="scrollerBottom" @on-scroll-bottom="loading" scroll-bottom-offset="-20" :scroll-bottom-offst="200">
    <div class='sense-list first-box'>
      <slot>这是STzhang的scroll模板</slot>
      <p class="no-data">{{getMore?"下拉刷新":"没有更多信息"}}</p>
    </div>
  </scroller>
</template>
<script>
import { Scroller } from "vux";
export default {
  props:["hasmore","pullup","setHeight","top"],
  components: { Scroller },
  name: "",
  data() {
    return {
      height:"",
      onFetching:false,
      list:[],    //列表
      more:false, //还有更多数据
    };
  },
  computed:{
    getMore(){

      this.height=this.setHeight||0
      return this.more=this.hasmore||false
    }
  },
  watch:{
    top(){
      this.$refs.scrollerBottom.reset({ top: 0 });
    }
  },
  methods: {
    loading() {
      if (!this.onFetching) {
        this.onFetching = true;

        if(!this.pullup){
          console.warn("pullup--上拉方法没有传入")
          this.resetFun()
          return
        }
        this.pullup(this.resetFun);
      }
    },
    resetFun() {
      setTimeout(() => {
        console.log("重置scroll");
        this.$nextTick(() => {
          this.$refs.scrollerBottom.reset();
        });
        this.onFetching = false;
      }, 200);
    }
  },
  created() {

  },
  mounted() {
    this.$nextTick(() => {
      this.$refs.scrollerBottom.reset({ top: 0 });
    });
    bus.$on("resetScroller",()=>{
      this.$refs.scrollerBottom.reset({ top: 0 });
    })
  },
  beforeDestroy(){
    bus.$off("resetScroller")
  }
};
</script>
<style lang="scss" scoped>
.sense-list {
  overflow-y: auto;
  font-size: 14px;
}
</style>